{extend name="wap/default_new/base" /}
{block name="resources"}
 <link rel="stylesheet" type="text/css" href="__TEMP__/{$style}/public/css/member_common.css">
<style>
img {
    vertical-align: middle;
    max-width: 100%;
    max-height: 100%;
	height: auto;
	}
.com_content{
	margin-top:44px;

}
	
.com_content li{
    width: 100%;
    float: left;
    margin-top: 10px;
	background: #fff;
    padding: 1vw 5vw;
}

.com_content ul li .goods_pic{
	width: 18vw;
	height: 18vw;
	position: absolute;
	left: 3vw;
}
.com_content ul li p{
	float:left;
	margin-left:23vw;
	width: 85vw;
	height: 9vw;
	line-height: 9vw;
}

.com_content ul li p:last-child{
	color: #cccccc;
	font-size:3.5vw;
}

.com_content ul li h4{
	font-size: 4vw;
	line-height:10vw;
	border-bottom: 1px solid #eeeeee;
}

.com_content ul li .from{
	line-height: 10vw;
	height: 10vw;
}

.com_content ul li  .from input{
	border: 0;
	height:7vw; 
}

.com_content ul li  .from button{
	vertical-align:middle;
	float:right;
	margin:2vw 0 0 0;
	border: 1px solid red;
	background: red;
	color: #fff;
	border-radius: 2px;
    font-size: 3.8vw;
    padding: 3px 10px;
	-webkit-tap-highlight-color: transparent;
    outline: 0;
}
.com_content ul .prompt{	
	background: transparent; color: #999999; font-size: 3.5vw;
}


</style>
{/block}
{block name="goodsHead"}
<section class="head">
		<a class="head_back" id="backoutapp" onclick="window.history.go(-1)" href="javascript:void(0)"><i class="icon-back"></i></a>
		<div class="head-title">{:lang('member_my_virtual_code')}</div>
	</section>
{/block}

{block name="main"}

<div class="com_content">
	<ul>
		<li>
			<div class="goods_pic"><img src="__TEMP__/{$style}/public/images/virtual_member.png"/></div>
			<p>名称</p>
			<p>商品核销</p>
		</li>
		<li>
			<h4>虚拟码</h4>
			<div class="from">
				<input type="text" id="virtual_code"  placeholder="请输入虚拟码">
				<button>核 销</button>
			</div>
		</li>
		
		<li class="prompt">或者扫买家的虚拟二维码 !</li>
	</ul>
	
</div>
<script type="text/javascript">
	$(function(){
		$('.cf-container .cf-tab-item').click(function(){
       		$('.cf-container .cf-tab-item').removeClass('select');
       		$(this).addClass('select');
       	})

// 		getMemberVirtualList(0);
		
	})
	function getMemberVirtualList(type){
		$.ajax({
			type:'post',
			async:true,
			url:'{:__URL('APP_MAIN/member/myVirtualCode')}',
			data:{'type':type },
			dataType:'json',
			success:function(data){
				var listhtml='<ul id="not_use">';
				if(data.length>0){
					$('.null_default').hide();
					for(var i=0;i<data.length;i++){
						
						var number = parseInt(data[i]['confine_use_number'])-parseInt(data[i]['use_number']);
						
						if(type==0){
							listhtml+='<li><a class="not_use" href="javascript:;">';
						}else{
							listhtml+='<li><a class="already-use" href="javascript:;">';
						}						
						listhtml+='<img src="__TEMP__/{$style}/public/images/virtual_member.png" style="width:100%;"/><div class="coupon-price"><i><img src="/niushop_b2c_demo/template/wap/default_new/public/images/member_default.png" ></i><p>'+data[i]['virtual_goods_name']+'</p></div>';
						listhtml+='<div class="coupon-lose"><span>'+data[i]['start_time']+'</span>{:lang('until')}<span>'+data[i]['end_time']+'</span></div>';
						listhtml+='<div class="coupon-price-right"><p>可用次数</p><p>'+number+'</p></div>';
	
						if(type==1){
							listhtml+='<span class="uneless-img"></span></a></li>';	
						}else if(type==-1){
							listhtml+='<span class="due-img"></span></a></li>';
						}else{
							listhtml+='</a></li>';
						}
					}
					listhtml+='</ul>';
				}else{
					listhtml='<div class="null_default"><i class="icon-nocontent-youhuiquan"></i><span class="nulltext">{:lang("you_do_not_have_any_coupons_yet")}！</span></div>';
				}
				
				$('.com_content').html(listhtml);
			}
		})
	}
    $("#backoutapp").click(function (){
        var json ={"center" : "1",}
        window.webkit.messageHandlers.center.postMessage(json);
    })
</script>

{/block}
{block name="bottom"}{/block}
